<template>
  <div class="article-container">
    <h2>{{ row.title }}</h2>

    <div class="box">
      <span class="t">{{ dateArt(row.createTime) }}</span>
      <span>{{ row.username }}</span>
      <span>
        <i class="el-icon-view"></i>
        {{row.visits}}
      </span>
    </div>

    <div class="bod" ref="test">
      {{ str }}
    </div>
    <!-- <h3 >搭个</h3> -->
  </div>
</template>
<script>
import { dateinit } from '@/utils/index.js'
export default {
  props: {
    row: {
      type: Object
    }
  },
  data () {
    return {
      str: ''
    }
  },
  created () {
    // var str = this.row.articleBody
    // str = str.replace('', '')
    // // str = str.replace('</p>', '')
    // console.log(str, '字符串')
    // this.str = str
  },
  methods: {
    dateArt (time) {
      return dateinit(time)
    }
  },
  mounted () {
    var str = this.row.articleBody
    var oDiv = document.createElement('div')
    oDiv.innerHTML = str
    var text = oDiv.innerText
    // console.log(text, '字符串')
    this.str = text
  }
}
</script>

<style scoped lang="scss">
::v-deep.el-dialog__body {
  padding: 15px 20px;
  background-color: pink;
}
.box,
.bod {
  font-size: 14px;
}
.box {
  margin-bottom: 15px;
}
.box span {
  margin-right: 7px;
}
.bod {
  border-top: 1px dotted #8a8888;

  background: #f5f5f5;
  padding: 20px;
}
</style>
